<template>
  <div class="detail-container">
    <el-card class="box-card">
      <div slot="header">
        <span>职工信息</span>
        <el-button style="float: right; padding: 3px 0" type="text" @click="$router.back()">返回</el-button>
      </div>
      <div class="text">
        <p>{{ '职工姓名：' + userInfo.name }}</p>
        <p>{{ '职工邮箱：' + userInfo.email }}</p>
        <p>职工权限：{{ userInfo.role | roleFormat }}</p>
      </div>
    </el-card>
  </div>
</template>

<script>
export default {
  name: 'Detail',
  props: ['id'],
  data() {
    return {
      userInfo: {},
    }
  },
  created() {
    this.getUserInfo()
  },
  methods: {
    async getUserInfo() {
      const { data: res } = await this.$http.get('/api/employees/userinfo/' + this.id)
      this.userInfo = res
    },
  },
}
</script>

<style lang="less" scoped>
.text {
  font-size: 14px;
  p {
    margin-bottom: 18px;
  }
}
</style>
